<template>
	<div class="about">
		<h1>This is an about page</h1>
		<button @click="getdata()">getdata</button>
		<br />
		<input v-model="studentid" />
		<button @click="deldata()">deldata</button>
		<br />
		<input v-model="form_insert.name" />
		<input v-model="form_insert.age" />
		<button @click="adddata()">adddata</button>
		<br />
		<input v-model="form_upload.id" />
		<input v-model="form_upload.name" />
		<input v-model="form_upload.age" />
		<button @click="uploaddata()">uploaddata</button>
		<br />
		<input v-model="studentid" />
		<button @click="finddata()">finddata</button>
		<br />
	</div>
</template>
<script>
import { studentAll, studentData } from '../api/index';
import { studentDel } from '../api/delete';
import { student_add } from '../api/insert';
import { student_upload } from '../api/update';

export default {
	data() {
		return {
			studentAll: '',
			studentid: '',
			form_insert: {
				name: '',
				age: ''
			},
			form_upload: {
				id: '',
				name: '',
				age: ''
			},
		};
	},
	methods: {
		getdata() {
			studentAll({})
				.then(res => {
					this.studentAll = res;
					console.log(this.studentAll);
				})
				.catch(err => {
					console.log(err);
				});
		},
		deldata() {
			studentDel({
				id: this.studentid
			})
				.then(res => {
					console.log(res);
				})
				.catch(err => {
					console.log(err);
				});
		},
		adddata() {
			var obj = this.form_insert;
			student_add(obj)
				.then(res => {
					console.log(res);
				})
				.catch(err => {
					console.log(err);
				});
		},
		uploaddata() {
			var obj = this.form_upload;
			student_upload(obj)
				.then(res => {
					console.log(res);
				})

				.catch(err => {
					console.log(err);
				});
		},

		finddata() {
			studentData({
				id: this.studentid
			})
				.then(res => {
					console.log(res);
				})
				.catch(err => {
					console.log(err);
				});
		}
	},
	mounted() {}
};
</script>
